import React, { memo, useEffect, useState } from 'react'
import { useNavigate } from 'react-router-dom';
import axios from '@/utils/axios'
import { ProductCard,NavBar } from 'react-vant'
import style from './index.module.scss'

const Index = memo(() => {
  const [list, setlist] = useState([])
  const navigate=useNavigate()
  return (
    <div>
      <NavBar
      className={style.nav}
      title="健康计划"  
      onClickLeft={() => navigate(-1)}
    />
      <div className={style.plan}>
          <div className={style.box}>
            <div className={style.text}>
              <h3>8天健康养成计划</h3>
              <p>6462人已加入</p>
              <p><button>免费加入</button></p>
            </div>
          </div>
          <div className={style.box}>
            <div className={style.text}>
              <h3>欧茜医生0~1岁育儿...</h3>
              <p>149086人已加入</p>
              <p><button>免费加入</button></p>
            </div>
          </div>
          <div className={style.box}>
            <div className={style.text}>
              <h3>21岁战痘计划</h3>
              <p>209952人已加入</p>
              <p><button>免费加入</button></p>
            </div>
          </div>
          <div className={style.box}>
            <div className={style.text}>
              <h3>睡眠改善计划</h3>
              <p>6462人已加入</p>
              <p><button>免费加入</button></p>
            </div>
          </div>
          <div className={style.box}>
            <div className={style.text}>
              <h3>30天上班族保健计划</h3>
              <p>6462人已加入</p>
              <p><button>免费加入</button></p>
            </div>
          </div>
          <div className={style.box}>
            <div className={style.text}>
              <h3>21天瘦腰计划</h3>
              <p>6462人已加入</p>
              <p><button>免费加入</button></p>
            </div>
          </div>
        </div>
    </div>
  )
})

export default Index
